<%@ page contentType="text/html; charset=UTF-8" language="java"
	import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/page/base.jsp"%>
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>excel导入管理</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<link href="<%=path %>/manage/css/jquery-ui-1.8.11.custom.css" rel="stylesheet" type="text/css"/>
	<link type="text/css" href="<%=path %>/manage/css/layout.css" rel="stylesheet" />
	<link type="text/css" href="<%=path %>/manage/css/new_style.css" rel="stylesheet" />
	<link href="<%=path %>/manage/css/main.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" type="text/css" href="<%=path%>/manage/css/colorbox.css" />
	<script type="text/javascript" src="<%=path %>/manage/js/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="<%=path %>/manage/js/jquery-ui-1.8.11.custom.min.js"></script> 
	<script type="text/javascript" src="<%=path %>/manage/js/script.js"></script>
	<script type="text/javascript" src="<%=path%>/manage/js/jquery.colorbox-min.js"></script>
	<script type="text/javascript" src="<%=path%>/manage/js/jquery_form.js"></script>
	<style type="text/css">
		.uploadarea {margin:10px 5px auto auto;}
		#excelImpForm span {color:#555;}
		#helpTip {
			display:block;
			font-family:Tahoma, Verdana, Arial, sans-serif;
			font-size:10px;
			padding:9px;
			border:1px solid #bae2f0;
			background:#e3f4f9;	
			margin:auto auto .5em 0;
		}		
		fieldset label{
			
		}
	</style>
	<script type="text/javascript">
		function excelImp() {
			var errInfo = checkInputOption();
			if(errInfo != ""){
				$("#infoShow").html(errInfo);
				return;
			}		
			var options = {success:function(responseText, statusText){
				if(responseText.indexOf("导入成功")>=0) {
					$("#uploadArea").html("<input type=\"file\" name=\"fileInput\" value=\"\" id=\"excelImpForm_fileInput\">");
				}
				$("#infoShow").html(responseText);
				document.getElementById("cboxLoadedContent").scrollTop = document.getElementById("colorbox").scrollHeight;
				$("#excelImpBtn").attr("disabled",false);
			}};
			$("#excelImpForm").ajaxSubmit(options);
			var loading = "<img src='"+root+"/manage/images/loading.gif'>";
			$("#infoShow").html(loading+"  导入中，请勿关闭窗口...");
			$("#excelImpBtn").attr("disabled",true);
		}
		
		function checkInputOption() {
			var reg = new RegExp("^[0-9]*$");
			var errMsg = "";
			var sheetNo = $("#excelImpForm_sheetNo").val();
			var headRow = $("#excelImpForm_headRow").val();
			if (sheetNo != "" && !reg.test(sheetNo)){
				errMsg="excel sheet no必须为数字,";
			}
			if (headRow != "" && !reg.test(headRow)){
				errMsg +="excel表头行数必须为数字";
			}
			return errMsg.substring(0, errMsg.length - 1);
		}
		$(document).ready(function() {
			$(".inline").colorbox({
				width:"600px", 
				height:"400px",
				title:"在您选择的分类下导入excel表的详情",
				top:"50px", 
				inline:true,
				overlayClose:false,
				onOpen:function(){
					$("#uploadArea").html("<input type=\"file\" name=\"fileInput\" value=\"\" id=\"excelImpForm_fileInput\">");
					$("#infoShow").html("");
				},
				onClosed:function() {
					if(($("#infoShow").html()).indexOf("导入成功") >= 0) {
						refreshData($("#excelImpForm_intCateId").val());
					}
				}
			});
		});
	</script>

  </head>
  
  <body>
    <fieldset>
    	<legend>用户导入</legend>
    	<select>
    		<option>全部</option>
    		<option>普通账号</option>
    		<option>新浪微博</option>
    		<option>腾讯微博</option>
    	</select>
    	<a class="btn_excel inline" href="#inline_content">excel导入</a>
    	<div id="progress1">
            <div class="percent"></div>
            <div class="pbar"></div>
            <div class="elapsed"></div>
        </div>
    </fieldset>
    <fieldset>
    	<legend>内容导入</legend>
    	<div>没有记录!</div>
    </fieldset>
    <fieldset>
    	<legend>个人信息导入</legend>
    	<div>没有记录!</div>
    </fieldset>
	<div style='display:none'>
		<div id='inline_content' style='padding:10px; background:#fff;'>
		<s:form action="/excel/impConsFromExcel.action" name="excelImpForm"
			id="excelImpForm" enctype="multipart/form-data" method="post">
			<s:hidden name="intCateId"></s:hidden>
			<div id="helpTip">
				<span>Tip:多次导入相同excel会重复添加记录；如果要导入用户信息请指定excel中的哪一列作为用于手机端登录的唯一标识；如果指定内容名称、缩略图、描述与excel列的关联,导入时将取这些列的值保存为详情的相应字段。</span><br>
			</div>
			<fieldset style="padding:5px">
				<legend style="font-size:14px;font-weight:bold">excel设置</legend>
				<label style="margin-left:10px">excel文件:</label><span id="uploadArea"><s:file name="fileInput" cssClass="uploadarea"></s:file></span><br>
				<label style="margin-left:10px">要导入的sheet:</label><s:textfield name="sheetNo" cssClass="uploadarea" /><span>数字,默认为:第一个sheet</span><br>
				<label style="margin-left:10px">表头行数:</label><s:textfield name="headRow" cssClass="uploadarea" /><span>数字</span><br>
			</fieldset>
			<div id="helpTip">
				<span>Tip:若不指定如下的字段映射，需按'用户名','昵称','密码','头像','积分','地址','电话','邮箱','性别' 命名excel表头。</span><br>
			</div>
			<fieldset style="padding:5px">
				<legend style="font-size:14px;font-weight:bold">excel表头的字段关联</legend>
				<label style="margin-left:10px">用户名:</label><s:textfield name="excelImpAttrMapping.uniqueUserAttr" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">昵称:</label><s:textfield name="excelImpAttrMapping.password" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">密码:</label><s:textfield name="excelImpAttrMapping.title" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">头像:</label><s:textfield name="excelImpAttrMapping.description" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">积分:</label><s:textfield name="excelImpAttrMapping.thumb" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">地址:</label><s:textfield name="excelImpAttrMapping.thumb" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">电话:</label><s:textfield name="excelImpAttrMapping.thumb" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">邮箱:</label><s:textfield name="excelImpAttrMapping.thumb" cssClass="uploadarea" /><br>
				<label style="margin-left:10px">性别:</label><s:textfield name="excelImpAttrMapping.thumb" cssClass="uploadarea" /><br>
			</fieldset>
		</s:form>
		<input style="position: relative;left: 43%;margin: 10px;" id="excelImpBtn" type="button" value="导入" onclick="excelImp()"><br>
		<span id="infoShow" style="color:red;margin-left:20px;"></span>
		</div>
	</div>
  </body>
</html>
